body,html{
    width: 100%;
    height: 100%;  
}
li{
    list-style: none;
}
a{
    text-decoration: none;
}
.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
._top{
    width: 100%;
    .px2rem(height,120);
    background: #7e4c81;
    display: flex;
    justify-content: center;
    align-items: center;
    span{
        width: 12%;
        .px2rem(height,100);
        a{
           width: 100%;
          .px2rem(height,100);
          text-align: center;
          color: #fff;
          img{
            .px2rem(width,80);
            .px2rem(height,80);               
          }              
        }
       
    }
    p{
        width: 88%;
        .px2rem(height,100);
        .px2rem(font-size,36);
        color: #fff;
        font-weight: bold;
        text-align: center;
        line-height: 2;
    }

}
._nav{
    ul{
        display: flex;
        .px2rem(margin-top,30);
        li{
            width: 33%;
            .px2rem(height,70);
            .px2rem(font-size,38);
            font-weight: bold;
            text-align: center;
           line-height: 2;
           border-right: 1px solid #7e4c81;
        }
        li:nth-child(3){
            border-right: none;
        }
        li:hover{
            border-bottom: 2px solid #7e4c81;
        }
    }
}
.cent{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
    .zhonghe{
        width: 90%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
//      display: none;
        .cent-hezi{
            width: 100%;
            .px2rem(height,315);    
            .px2rem(margin-top,40);      
            .cent-ht{
                 width: 100%;
                .px2rem(height,105);  
                 display: flex;
                 p{
                   width: 40%;
                   .px2rem(height,105);
                   background: #CCCCCC;
                   .px2rem(font-size,38);
                   font-weight: bold;
                   text-align: center;
                   line-height: 3;
                 }
                 input{
                     flex: 1;
                     background: #eee;
                     .px2rem(font-size,38);
                 }
                 .p-1{
                     background: #E8E8E8;
                 }
                 .in-1{
                     background: none;  
                 }
                 .tjia{
                     width: 20%;
                    .px2rem(height,80);
                    .px2rem(font-size,32);
                    color: #fff;
                    font-weight: bold;
                    background: #7e4c81;
                    .px2rem(margin-left,547);
                    .px2rem(margin-top,12);
                 }
            }
        }
        .cent-btm{
            width: 100%;
            .px2rem(margin-top,40);
            .btm-top{
                width: 100%;
                .px2rem(height,100);
                display: flex;          
                background: #ccc;
                text-align: center;
                line-height: 2.2;
                h6{
                    width: 50%;
                    .px2rem(height,100);
                    .px2rem(font-size,40);
                    font-weight: bold;
                    color: #fff;
                }
            }
            .cent{
                width: 100%;
                .cent-shang{
                    width: 100%;
                    .px2rem(height,100);
                    display: flex;             
                   span{
                       width: 14%;
                       .px2rem(height,100);
                       background: tomato;
                       display: flex;
                       justify-content: center;
                       align-items: center;
                       img{
                           .px2rem(width,60);
                           .px2rem(height,60);                    
                       }
                   }
                   p{
                       width: 50%;
                       .px2rem(height,100);
                       .px2rem(font-size,38);
                       font-weight: bold;
                       text-align: center;
                       line-height: 3;
                   }
                   .huse{
                       background: #ccc;
                   }
                   
                }
                .huise{
                       background: #E8E8E8;
                   } 
            }
            .botm{
                width: 100%;
                .px2rem(height,100);
                background: #7e4c81;
                p{
                    .px2rem(font-size,38);
                    color: #fff;
                    line-height: 3;
                    padding-left: 4%;
                }
            }
            
        }
    }
    .youhe{
        width: 95%;
        .px2rem(margin-top,30);
         display: none;
        input{
            width: 95%;
            .px2rem(height,70);
            .px2rem(font-size,38);
            color: #ccc;
            .px2rem(margin-left,10);
            .px2rem(margin-top,28);
        }
        .youhexia{
            width: 100%;
            span{
                display: block;
                width: 100%;
                .px2rem(height,90);
                .px2rem(font-size,32);
                border-bottom: 1px solid #eee;
                line-height: 3;
                
            }
            span:hover{
                border-left: 2px solid #007AFF;
            }
        }    
    }
    
    .zuo-he{
        width: 95%;
        .px2rem(margin-top,50);
        display: none;
        .zuohe-top{
            width: 100%;
            .px2rem(height,100);
            display: flex;
            background: #eee;            
            h5{
                width: 40%;
                .px2rem(height,100);
                background: #e9ecf1;
                text-align: center;
                line-height: 3;
                .px2rem(font-size,38);
                font-weight: bold;
            }
            .dlal{
                width: 60%;
                display: flex; 
                justify-content: center;
                align-items: center;
               input{
                .px2rem(width,350);
                .px2rem(height,60);
                border: none;                             
              } 
            }            
        }
        .zuohe-top:nth-child(2){
            background: bisque;
        }
        .zuohe-top:nth-child(2) h5{
            background: #BCE8F1;
        }
        .zuohe-si{
           width: 100%;
           .px2rem(height,200);
            display: flex;
            h5{
                width: 40%;
                .px2rem(height,200);
                background: #e9ecf1;
                text-align: center;
                line-height: 5;
                .px2rem(font-size,38);
                font-weight: bold;
            }
            .dlals{
                width: 60%;
                display: flex; 
                justify-content: center;
                align-items: center; 
                background: #C7DDEF;
                p{
                  .px2rem(font-size,36);
                  color: #fff;
                }
            }
        }
       .guzhang{
           width: 100%;
           .px2rem(margin-top,50);         
           .guzhang-you{
                 width: 100%;
                 display: flex;
                  h4{
                   width: 90%;
                   .px2rem(height,100);
                   .px2rem(font-size,38);
                    text-align: center;
                    background: #c672cc;
                    color: #fff; 
                    line-height: 3;                
               }
               .ja{
                  width: 10%;                
                  text-align: center;
                  line-height: 1.4;
                  background: #b066b5;
                  color: #fff;   
               } 
           }
           .guzhang-yi{
               width: 100%;
               .px2rem(height,100);
               display: flex;
               span{
                   width: 10%;
                   .px2rem(height,100);
                   background: #ccc;
                   display: flex;
                   justify-content: center;
                   align-items: center;
                   img{
                       .px2rem(width,70);
                       .px2rem(height,70);
                   }
               }
               p{
                   width: 80%;
                   .px2rem(height,100);
                   .px2rem(font-size,40);
                   text-align: center;
                   line-height: 3;
               }
               .qu{
                   background: none;
               }
               .ig{
                   background: chocolate;
               }              
            }
           .guzhang-yi:nth-child(3){
               background: #eee;
           }
           .guzhang-yi:nth-child(5){
               background: #eee;
           }
       }
    }
    
}

